<template>
    <view style="width: 100%;height: 100%">
        <div class="batch-task-center">
            <div class="batch-task-top">
                <checkbox @click="checkAll()" style="transform:scale(0.7)" :checked="selectListAll"/>
                <span>{{i18n('selectAll','全选')}}</span>
            </div>
            <div class="batch-task-list">
                <div class="batch-center">
                    <div v-for="(record,index) in taskList" class="batch-task">
                        <checkbox style="transform:scale(0.7)" @click="selectRow(index)"
                                  :checked="record.selected"/>
                        <div @click="BpmHandle(record)">
                            <span class="batch-center-subject">{{ record.subject }}</span>
                            <div class="batch-center-time">
                                <div style="flex: 1" class="batch-center-icon"><i
                                    class="iconfont icon-time"></i>{{ record.createTime }}
                                </div>
                                <div class="batch-center-icon"><i
                                    class="iconfont icon-people"></i>
                                    <rx-user-info style="font-size: 1rem" :userId="record.applicantNo"></rx-user-info>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="batch-task-opinion">
                <span>{{ i18n('remark', '意见') }}</span>
                <view class="NodesExecutors-textarea">
                    <textarea style="height: 100%;width: 100%" v-model="formData.opinion"
                              :placeholder="i18n('remark','请输入意见','input')"/>
                </view>
                <button class="batch-task-button" @click="handleCompleteCheck" icon="check" :loading="loading"
                        type="primary">{{ $ti18('rxForm.commitBtn', '提交') }}
                </button>
            </div>
        </div>
    </view>
</template>

<script>
import BpmtaskApi from '@/api/rxBpm/bpmTask'
import RxUserInfo from "@/components/RxUserInfo"

export default {
    components:{
        RxUserInfo
    },
    data() {
        return {
            rootVm: true,
            boAttrList: [
                {
                    comment: "流程标题"
                }
            ],
            alias: "taskId",
            taskList: [],
            //是否全选
            selectListAll: false,
            //选择的行
            selectIndex: -1,
            formData: {
                opinion: '',
                checkType: "AGREE",
            },
            loading: false,
            isEnd: false,
            initTaskId: "",
            mobileAppId: uni.getStorageSync("mobileAppId") || ""

        }
    },
    onLoad(option) {
        let params = JSON.parse(option.data);
        this.initTaskId = params.taskId;
        this.init()
    },
    methods: {
        i18n(name, text, key) {
            return this.$ti18(name, text, "bpmLang", key);
        },
        checkAll() {
            this.selectListAll = !this.selectListAll;
            this.taskList = this.taskList.filter(res => {
                res.selected = this.selectListAll;
                return res
            })
        },
        selectRow(index, name) {
            this.selectIndex = index;
            let row = this.taskList[index];
            row.selected = !row.selected;
            let result = this.taskList.map(item => {
                if (item.selected) {
                    return 'true'
                } else {
                    return 'false'
                }
            })
            if (result.includes('false')) {
                this.selectListAll = false
            } else {
                this.selectListAll = true
            }
        },
        init() {
            let self = this;
            BpmtaskApi.getBatchTasksInfo(this.initTaskId).then(res => {
                self.taskList = res;
                self.taskList.forEach(item => {
                    item.selected = false;
                })
            })
        },
        getSelectTaskIds() {
            let taskIds = [];
            for (let i = 0; i < this.taskList.length; i++) {
                let item = this.taskList[i];
                if (item.selected) {
                    taskIds.push(item.taskId);
                }else if(!this.initTaskId) {
                    this.initTaskId =item.taskId;
                }
            }
            return taskIds;
        },
        handleCompleteCheck() {
            var self_ = this;
            let taskIds = this.getSelectTaskIds();
            if (taskIds.length == 0) {
                uni.showToast({
                    title: this.i18n('selectSumTaskTip', '请选择需要批量审批的任务！'), // 消息内容
                    duration: 2000, // 持续时间（单位：毫秒）
                    icon: 'none' // 图标类型（可选值：success/loading/none）
                });
                return;
            }
            uni.showModal({
                title: self_.$ti18('rxMsa.tipsInfo','提示信息'),
                content: this.i18n('batchTaskTip', '你确定要审批吗?'),
                confirmText: self_.$ti18('rxForm.okBtn', '确定'),
                cancelText: self_.$ti18('rxForm.cancelBtn', '取消'),
                success: function (res) {
                    if (res.confirm) {
                        self_.sumitTaskFun()
                    } else if (res.cancel) {
                    }
                }
            });
        },
        showMessage(res) {
            let status = res.code;
            let message = res.message;

            uni.showToast({
                title: message, // 消息内容
                duration: 1500, // 持续时间（单位：毫秒）
                icon: 'none' // 图标类型（可选值：success/loading/none）
            });
            switch (status) {
                case 0:
                    if (this.isEnd) {
                        uni.navigateBack({
                            delta: 3
                        })
                    } else {
                        this.init();
                    }
                    break;
                case -1:
                    this.init();

                    break;
                case 1:
                    break;
            }
        },
        sumitTaskFun() {
            var self_ = this;
            this.initTaskId ="";
            let taskIds = this.getSelectTaskIds();
            this.formData.taskIds = taskIds.join(",");
            if (taskIds.length == self_.taskList.length || taskIds.length == (self_.taskList.length - 1)) {
                this.isEnd = true;
            }
            self_.loading = true;

            BpmtaskApi.batApprove(this.formData).then(res => {
                self_.loading = false;
                self_.showMessage(res);
            })
        },
        BpmHandle(item){
            let params = {
                taskId: item.taskId,
                instId: item.instId,
                routerName:'openDoc',
                action:'edit'
            }
            let mobileAppId = uni.getStorageSync("mobileAppId");
            let appId =''
            if(item.appId){
                appId=item.appId?item.appId:mobileAppId
            }
            uni.navigateTo({
                url:'/views/modules/bpm/OpenDoc?params='+ JSON.stringify(params) +"&appId="+appId
            })

        },
    },

}
</script>

<style scoped>
.batch-task-center {
    display: flex;
    height: 100%;
    width: 100%;
    overflow: auto;
    flex-direction: column;
}

.batch-task-list {
    flex: 1;
    overflow: auto;
}

.batch-task-opinion {
    background: #FFFFFF;
    box-shadow: 1px 1px 5px #dce1e6;
    padding: 0.5rem 0.5rem 0rem 0.5rem;
}

.NodesExecutors-textarea {
    width: 100%;
    height: 6rem;
    box-sizing: border-box;
    padding: 0.5rem;
    border-radius: 10px;
    margin-top: 0.5rem;
    border: 1px solid rgb(234, 232, 232);
}

.batch-task-button {
    margin: 0.5rem 0px;
    width: 100%;
}

.batch-center {
    background: white;
    border-radius: 0px 0px 10px 10px;
    width: calc(100% - 2rem);
    margin: auto;
    margin-bottom: 0.5rem;
    padding: 0rem 0.5rem 0.5rem 0.5rem;
}

.batch-task-top {
    line-height: 2rem;
    background: white;
    border-radius: 10px 10px 0px 0px;
    width: calc(100% - 2rem);
    margin: auto;
    margin-top: 0.5rem;
    padding: 0.5rem;
    border-bottom: 1px solid rgb(232, 232, 232);
}

.batch-task {
    display: flex;
    align-items: flex-start;
    padding-top: 0.5rem;
    border-bottom: 1px solid rgb(232, 232, 232);
}
.batch-task:last-child{
    border: none;
}
.batch-center-subject {
    font-size: 1rem;
    line-height: 22px;
    display: block;
    margin-top: 0.2rem;
}

.batch-center-time {
    display: flex;
    align-items: center;
    margin-bottom: 0.3rem;
}

.batch-center-icon {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
    color: rgba(0, 0, 0, 0.45);
}

.batch-center-icon i {
    font-size: 1rem;
    margin-right: 5px;
}
</style>
